<!doctype html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>典卡姆办公管理系统</title>
    <link rel="stylesheet" type="text/css" href="../../res/css/styles.css">
    <link rel="shortcut icon" type="image/x-icon" href="../../res/images/favicon.ico">
    <script type="text/javascript" src="../../res/layui/layui.js"></script>
</head>
<body>
<div class="htmleaf-container">
    <div class="wrapper" id="larg-header">
        <div class="container">
            <h1 style="color: white">.com</h1>

            <form class="form" id="form">
                <input type="text" placeholder="请输入账号" id="personnelAccount" name="personnelAccount">
                <input type="password" placeholder="请输入密码" id="personnelPwd" name="personnelPwd">
                <!--<button type="submit" id="">登录</button>-->
                <input class="formButton" type="button" id="login-button" value="登录"/>
            </form>
        </div>

        <ul class="bg-bubbles">
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
            <li></li>
        </ul>
    </div>
</div>

<script src="../../res/js/jquery-3.4.1.min.js" charset="utf-8"></script>
<script>
    layui.use('layer', function () {
        var layer = layui.layer;


        $('#login-button').click(function (event) {
            event.preventDefault();
            if(!$("#personnelAccount").val()){
                layer.alert("账号不能为空", {
                    icon: 0,
                });
                return null;
            }
            if(!$("#personnelPwd").val()){
                layer.alert("密码不能为空", {
                    icon: 0,
                });
                return null;
            }
            $('#form').hide();
            $('#form').hide(500);
            $('.wrapper').addClass('form-success');
            isLogin()
        });

        $('#personnelAccount').bind('keypress', function (event) {
            if (event.keyCode == "13") {
                event.preventDefault();
                //回车执行查询
                $('#login-button').click();
            }
        });

        $('#personnelPwd').bind('keypress', function (event) {
            if (event.keyCode == "13") {
                event.preventDefault();
                //回车执行查询
                $('#login-button').click();
            }
        });

    });


    function isLogin() {
        $.ajax({
            cache: false,
            url: "../../OaPersonnelAction/isLogin",
            type: 'GET',
            data: {personnelAccount: $("#personnelAccount").val(), personnelPwd: $("#personnelPwd").val()},
            success: function (obj) {
                console.log(obj)
                if (obj.data.code == 1) {
                    location.href = "index.html";
                } else if (obj.data.code == 500) {
                    location.href = "error/error.html";
                } else {
                    $('#form').show(500);
                    $('.wrapper').removeClass('form-success');
                    layer.alert("账号或密码错误", {
                        icon: 2,
                    })
                }
            },
            error: function () {
                location.href = "error/404.html";
            }
        });
    }
</script>
<script type="text/javascript">
    $(function () {
        heigth = window.innerHeight;
        largeHeader = document.getElementById('larg-header');
        largeHeader.style.height = heigth + 'px';
    })
</script>
</body>
</html>